{include file='common/doc'}

<style>
    .lgp-menu {
        text-align: center;
        height: calc(100vh);
        box-shadow: 0px 0px 20px #c0c4cc;
        overflow: scroll;
    }

    *::-webkit-scrollbar {
        width: 4px; /*height: 4px;*/
    }

    *::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        background: #5FB878;
    }

    *::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
        border-radius: 0;
        background: rgba(0, 0, 0, 0.1);
    }

    .lgp-menu-title {
        background-color: #5FB878;
        color: #FFFFFF;
        padding: 10px 0;
    }

    .lgp-nav .lgp-nav-item {
        padding: 10px 0;
    }

    .lgp-nav-item a:hover {
        color: #5FB878;
    }

    .lgp-nav-item .lgp-nav-child {
        background-color: #f6f6f6;
        display: none;
        padding-left: 10px;
    }

    .lgp-op {
        display: none
    }

    .lgp-nav-item a:hover + .lgp-op {
        display: inline;
        position: absolute;
        background: #FFFFFF;
    }

    .lgp-nav-item .lgp-op:hover {
        display: inline;
        cursor: pointer;
        position: absolute;
        background: #FFFFFF;
    }

    .lgp-nav-item .lgp-op i:hover {
        color: red;

    }
</style>
<body>
<div class="layui-fluid">
    <div class="layui-row layui-col-space30">
        <div class="layui-col-md1 lgp-menu ">
            <div class="lgp-menu-title"><i class="layui-icon layui-icon-app"></i>&nbsp;前台栏目 <i
                    class="layui-icon layui-icon-add-1"></i></div>
            <?php echo $column ?>

        </div>
        <div class="layui-col-md11">
        </div>

        <div class="layui-col-md11" id="content">
            <iframe src="/"  style="  height: calc(88vh);width:100%" frameborder="0"></iframe>
        </div>
    </div>
</div>
<template id="module_form">
    <form class="layui-form" style="margin-top:30px;">
        <div class="layui-form-item">
            <label class="layui-form-label">模块名称</label>
            <div class="layui-input-inline">
                <input type="text"  lay-verType='tips'   placeholder="模块名称" lay-verify="required" name="module_name" class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label for="" class="layui-form-label">目录</label>
            <div class="layui-input-inline">
                <input type="text"   lay-verType='tips'   lay-verify="required"  placeholder="对应控制器" name="control" class="layui-input">
            </div>
            <label style="width:2em;" class="layui-form-label">文件</label>
            <div class="layui-input-inline">
                <input type="text"  lay-verType='tips' placeholder="对应控制器下的方法" lay-verify="required" name="method" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="module_submit">保存</button>
                <button type="reset" class="layui-btn layui-btn-primary">取消</button>
            </div>
        </div>
    </form>
</template>
<script src="/layuiadmin/layui/layui.js"></script>
</body>

<script>
    layui.config({
        base: '/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table'], function () {
        var $ = layui.$
            , form = layui.form
            , table = layui.table;
        $('.lgp-menu').on('click', 'a', function () {
           let lgp_href = $(this).attr('lgp-href');
            $('#content').find('iframe').attr('src','/admin/'+lgp_href);
            let x = $(this).siblings('.lgp-nav-child');
            let icon = $(this).siblings('.dirs');
            x.toggle('fast');
            if (icon[0] !== undefined) {
                if (icon.hasClass('layui-icon-down')) {
                    icon.removeClass('layui-icon-down');
                    icon.addClass('layui-icon-up');
                } else {
                    icon.removeClass('layui-icon-up');
                    icon.addClass('layui-icon-down');
                }
                $(this).find('.lgp-nav-child').removeAttr('style');
            }
        });
        $('.layui-icon-app').click(function () {
            layer.open({
                type: 1,
                area: ['auto','300px'],
                title:'模块添加',
                content:$(module_form).html(),
                success:function(lay,index){
                    form.on('submit(module_submit)',function(extract_obj){
                        let field = extract_obj.field;
                        let status = request({
                            url: 'add',
                            method: 'post',
                            data:field
                        });
                        if (status !==false){
                            layer.close(index);
                        }
                       return false;
                    });
                }
            })
        })

    });
</script>
</html>

